<template>
  <div class="header1-panel header1-panel-default">
    <div class="header1-panel-heading">
      <h3 class="header1-panel-title">基本信息</h3>
    </div>
    <div class="header1-panel-body">
      <el-row class="header-eldiv">
        <el-col :span="24">
          <el-input
                  v-model="tableHeaderParams.level1_desc"
                  disabled
                  v-on:input="getChangeStringValue()"
          >
            <template slot="prepend">单位工程：</template>
          </el-input>
        </el-col>
      </el-row>
      <el-row class="header-eldiv">
        <el-col :span="24">
          <el-input
                  v-model="tableHeaderParams.level2_desc"
                  disabled
                  v-on:input="getChangeStringValue()"
          >
            <template slot="prepend">分部工程：</template>
          </el-input>
        </el-col>
      </el-row>
      <el-row class="header-eldiv">
        <el-col :span="24">
          <el-input
                  v-model="tableHeaderParams.level3_desc"
                 disabled
                  v-on:input="getChangeStringValue()"
          >
            <template slot="prepend">分项工程：</template>
          </el-input>
        </el-col>
      </el-row>
      <el-row class="header-eldiv">
      <el-col :span="24">
        <el-input
          v-model="tableHeaderParams.level4_desc"
          disabled
          v-on:input="getChangeStringValue()"
        >
          <template slot="prepend">施工部位：</template>
        </el-input>
      </el-col>
    </el-row>
    <el-row class="header-eldiv">
      <el-col :span="24">
        <el-input
          v-model="tableHeaderParams.checkContent"
          disabled
          v-on:input="getChangeStringValue()"
        >
          <template slot="prepend">检查内容：</template>
        </el-input>
      </el-col>
    </el-row>
    <el-row class="header-eldiv">
      <el-col :span="24">
        <el-input
          v-model="record.xAxis"
          placeholder="请输入X轴桩号"
          v-on:input="getChangeStringValue()"
        >
          <template slot="prepend">X轴桩号：</template>
        </el-input>
      </el-col>
    </el-row>
    <el-row class="header-eldiv">
      <el-col :span="24">
        <el-input
          v-model="record.yAxis"
          placeholder="请输入Y轴桩号"
          v-on:input="getChangeStringValue()"
        >
          <template slot="prepend">Y轴桩号：</template>
        </el-input>
      </el-col>
    </el-row>
      <el-row class="header-eldiv">
        <el-col :span="24">
          <el-input
                  v-model="record.elevation"
                  placeholder="请输入高程"
                  v-on:input="getChangeStringValue()"
          >
            <template slot="prepend">EL高程：</template>
          </el-input>
        </el-col>
      </el-row>
    <el-row class="header-eldiv">
      <el-col :span="12">
        <div class="header-span" style="float: left;">开始施工时段：</div>
        <el-date-picker
          style="float: left;"
          v-model="record.rasdate"
          format="yyyy-MM-dd"
          value-format="yyyy-MM-dd"
          type="date"
          placeholder="选择日期"
          v-on:input="getChangeStringValue()"
        ></el-date-picker>
      </el-col>
      <el-col :span="12">
        <el-date-picker
          style="float: right;"
          v-model="record.raedate"
          format="yyyy-MM-dd"
          value-format="yyyy-MM-dd"
          type="date"
          placeholder="选择日期"
          v-on:input="getChangeStringValue()"
        ></el-date-picker>
        <div class="header-span" style="float: right;">结束施工时段：</div>
      </el-col>
    </el-row>
    <el-row class="header-eldiv">
      <el-col :span="24">
        <el-input
          v-model="record.rains"
          placeholder="请输入施工依据"
          v-on:input="getChangeStringValue()"
        >
          <template slot="prepend">施工依据：</template>
        </el-input>
      </el-col>
    </el-row>
    </div>
  </div>
</template>

<script>
export default {
  name: "tableheader1",
  // props: {
  //   /* 父组件传过来的数据 */
  //   recordin: {
  //     type: Object
  //   },
  //   tableHeaderParams:{
  //     type:Object
  //   }
  // },
  props:["recordin","tableHeaderParam"],
  data() {
    return {
      record: this.recordin,
      tableHeaderParams:this.tableHeaderParam
    };
  },
  created() {
    // console.log("父组件传递的参数：===>>>"+JSON.stringify(this.record));
  },
  watch: {
    recordin:{
      handler(newVal, oldVal) {
        this.$emit("listenToTableheader1", newVal);
      }
    }
  },
  methods: {
    getChangeStringValue() {
      this.$emit("listenToTableheader1", this.record);
    }
  }
}
</script>
<style>
.header-eldiv {
  margin-bottom: 5px;
}
.header-span {
  background-color: #f5f7fa;
  color: #909399;
  border: 1px solid #dcdfe6;
  border-radius: 4px;
  padding: 0 20px;
  white-space: nowrap;
  text-align: center;
  height: 30px;
  line-height: 30px;
  float: left;
  font-size: 13px;
  border-right: 0;
}
.header1-panel{	
    margin-bottom: 20px;
    background-color: #fff;
    border: 1px solid transparent;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
    box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
}
.header1-panel-default > .header1-panel-heading {
    color: #333;
    background-color: #f5f5f5;
    border-color: #ddd;
}
.header1-panel-default{
	border-color: #ddd;
}
.header1-panel-heading{
	  padding: 10px 14px;
    border-bottom: 1px solid transparent;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
}
.header1-panel-title {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 16px;
    color: inherit;
}
.header1-panel-body{
    padding: 6px;
}
</style>


